<template>
  <div class="app-container-delivery">
    <div class="maindelivery" v-show="showdelivery">
      <div class="delivery-container">
        <el-form ref="form" :model="deliveryFrom" label-width="80px">
          <div class="flexmaindelivery">
            <el-form-item label="后台单号:">
              <el-input v-model.trim="deliveryFrom.xmbzNo" placeholder="请输入后台单号" clearable style="width: 150px;" class="filter-item"
                size="small" @keyup.enter.native="handleFilter(Launchdate)" />
            </el-form-item>
            <!--  <el-form-item label="平台单号:">
              <el-input v-model.trim="deliveryFrom.platformOrderId" placeholder="请输入平台单号" clearable style="width: 150px;"
                class="filter-item" size="small" @keyup.enter.native="handleFilter" />
            </el-form-item> -->
            <el-form-item label="配送时间:">
              <el-date-picker size='small' v-model="Launchdate" type="datetimerange" range-separator="至"
                start-placeholder="开始时间" end-placeholder="结束时间" :default-time="['00:00:00', '23:59:59']" value-format="yyyy-MM-dd HH:mm"
                format="yyyy-MM-dd HH:mm" :clearable="false" align="right">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="地区:">
              <el-select ref="mainWarehouseRef" v-model="mainWarehouseNames" placeholder="请选择地区" style="width: 120px;"
                class="filter-item" size="small" @change="getmainWarehouseIds" @keydown.native="selectBlur($event)">
                <el-option v-for="item in mainWarehousesList" :key="item.id" :label="item.deptName" :value="{label:item.deptName,value:item.id}" />
              </el-select>
            </el-form-item>
            <el-form-item>
              <!-- <div class="flex"> -->
              <el-button type="primary" class="filter-item" icon="el-icon-search" size="small" @click="handleFilter(Launchdate)"
                style="margin-right: 10px;" plain>查询</el-button>

              <!-- <el-checkbox v-model="clickFramingchecked" border="" size="small" @change='clickFraming'>
                  开启自动刷单
                </el-checkbox>
                  <el-badge :value="this.abnormatotal" :max="99" class="item">
                    <el-button class="filter-item" size="small" @click="HandledeliveryAbnormal">配送异常列表</el-button>
                  </el-badge> -->
              <!-- </div> -->
            </el-form-item>
            <el-form-item>
              <!-- <div class="flex"> -->
              <!-- <el-button type="primary" class="filter-item" icon="el-icon-search" size="small" @click="handleFilter(Launchdate)"
                  style="margin-right: 10px;" plain>查询</el-button> -->
              <el-checkbox v-model="clickFramingchecked" border="" size="small" @change='clickFraming'>
                开启自动刷单
              </el-checkbox>
              <el-badge :value="this.abnormatotal" :max="99" class="item">
                <el-button class="filter-item" size="small" @click="HandledeliveryAbnormal">配送异常列表</el-button>
              </el-badge>
              <!-- </div> -->
            </el-form-item>


          </div>
        </el-form>
      </div>
      <div class="Distribution">
        <div class="Distribution-item" v-for="(item,index) in DistributionList" :key="index" @click="handleTabs(index,item)"
          :class="{active:(indexs==index)}">
          <div class="Warehouse">{{item.name}}</div>
          <div class="deliveryData">
            <div class="Unassigned">
              <div class="names">未分配</div>
              <div class="name">已分配</div>
            </div>
            <div class="allocated">
              <div>{{item.notDelivery}}</div>
              <div>{{item.deliveried}}</div>
            </div>
          </div>
        </div>

      </div>
      <div class="DistributionTable">
        <div class="unassignedList" v-if="Unassigned==1">
          <div class="tag">
            <img :src="role" alt="">
            <div class="ordernum" style="margin-right: 20px;">
              <span class="order-quantity" v-if='DistributionTableList'>未分配&nbsp;&nbsp; {{DistributionTableList.length}}单</span>
              <span class="order-quantity" v-else>未分配&nbsp;&nbsp; 0单</span>
            </div>
            <el-button size="mini" type="primary" plain @click="handleModifydeliverysUn" onkeydown="if(event.keyCode==13){event.keyCode=0;event.returnValue=false;}">
              选择配送员</el-button>
          </div>
          <el-table :data="DistributionTableList" style="width: 100%" ref="multipleTableNo" @select='clearOtherNo(DistributionTableList)'
            @select-all='clearOtherNo(DistributionTableList)' @selection-change="handleSelectionChangeNo">
            <el-table-column type="selection" style="width: 5%" prop="id"></el-table-column>
            <el-table-column fixed prop="xmbzNo" label="后台单号" align="center" width="100"></el-table-column>
            <!--    <el-table-column fixed prop="platformOrderId" label="平台单号" align="center" style="width: 10%"></el-table-column> -->
            <el-table-column prop="deliveryTime" label="配送时间" width="150" align="center"></el-table-column>
            <el-table-column prop="status" label="状态" align="center" width="100"></el-table-column>
            <el-table-column prop="printingState" label="打印状态" align="center" width="100">
              <template slot-scope="{row}">
                <span v-if='row.printingState==1'>未打印</span>
                <span v-if='row.printingState==2'>已打印</span>
              </template>
            </el-table-column>
            <el-table-column prop="receiverAddress" label="配送地址" style="width: 45%" align="center"></el-table-column>
            <el-table-column fixed="right" label="操作" align="center" width="100">
              <template slot-scope="scope">
                <el-button size="mini" @click="handleWatchOrder(scope.row)" onkeydown="if(event.keyCode==13){event.keyCode=0;event.returnValue=false;}">查看订单</el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <div class="assigning" v-if="assigning==2" v-for="(item,index) in AssigningData" :key='index'>
          <div class="tag">
            <img :src="role" alt="">
            <div class="ordernum">
              <span class="delivery">{{item.delivery}} &nbsp;&nbsp;&nbsp;&nbsp;{{item.total}}单 &nbsp;&nbsp;&nbsp;&nbsp;</span>
              <span class="order-quantity">配送中：{{item.deliveryCount}}&nbsp;&nbsp;&nbsp;&nbsp;</span>
              <span class="order-signfor">已签收：{{item.receivedCount}}&nbsp;&nbsp;</span>
            </div>
            <el-button size="mini" type="success" plain @click="handleAllSetOutOrder(item)" onkeydown="if(event.keyCode==13){event.keyCode=0;event.returnValue=false;}">
              配送出发</el-button>
            <el-button size="mini" type="primary" plain @click="handleModifydeliverys(item)" onkeydown="if(event.keyCode==13){event.keyCode=0;event.returnValue=false;}">
              修改配送员</el-button>
          </div>
          <el-table :ref="'multipleTable' + item.id" :data="item.list" style="width: 100%" @select='clearOther(item)'
            @select-all='clearOther(item)' @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="44" prop="id" style="width: 5%"></el-table-column>
            <el-table-column fixed prop="xmbzNo" label="后台订单" align="center" width="100"></el-table-column>
            <!--          <el-table-column fixed prop="platformOrderId" label="平台单号" align="center" style="width: 10%"></el-table-column> -->
            <el-table-column prop="deliveryTime" label="配送时间" width="150" align="center"></el-table-column>
            <el-table-column prop="status" label="状态" width="100" align="center"></el-table-column>
            <!-- <el-table-column prop="goodsName" label="商品名称" align="center" style="width: 25%" :show-overflow-tooltip="true"></el-table-column> -->
            <el-table-column prop="printingState" label="打印状态" width="100" align="center" :show-overflow-tooltip="true">
              <template slot-scope="{row}">
                <span v-if='row.printingState==1'>未打印</span>
                <span v-if='row.printingState==2'>已打印</span>
              </template>
            </el-table-column>
            <el-table-column prop="receiverAddress" label="配送地址" style="width: 45%" align="center"></el-table-column>
            <el-table-column fixed="right" label="操作" align="center" width="220">
              <template slot-scope="{row}">
                <el-button size="mini" type="success" plain @click="handleSetOutOrder(row)" v-if="row.deliverySetOut=='1'">
                  配送出发</el-button>
                <el-button size="mini" @click="handleWatchOrder(row)" onkeydown="if(event.keyCode==13){event.keyCode=0;event.returnValue=false;}">查看订单</el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
    </div>
    <div class="showabnormal" v-show="showabnormal">
      <div class="tab">
        <div class="tab-item" @click="backabnormal">配送分配</div>
        <div class="tab-item act">/配送异常列表/</div>
      </div>
      <div class="fifterabnormal">
        <el-form ref="form" :model="abnormalFrom" label-width="80px">
          <div class="flexmaindelivery">
            <el-form-item label="后台单号:">
              <el-input v-model.trim="abnormalFrom.xmbzNo" placeholder="请输入后台订单" style="width: 150px;" class="filter-item"
                size="small" />
            </el-form-item>
            <el-form-item label="配送员:">
              <el-input v-model.trim="abnormalFrom.delivery" placeholder="请输入配送员" style="width: 150px;" class="filter-item"
                size="small" />
            </el-form-item>
            <el-form-item width="300px">
              <div class="flexmaindelivery">
                <el-button type="primary" class="filter-item" icon="el-icon-search" size="small" @click="handleabnormalFilter">查询</el-button>
              </div>
            </el-form-item>
          </div>
        </el-form>
      </div>
      <div class="abnormaList" v-for="(item,index) in abnormalList" :key="index" v-if='abnormalList&&abnormalList.length>0'>
        <div class='line'>
          <div class='xmbzNo'> <span>后台单号:</span>
            {{item.xmbzNo}}</div>
          <div class="count">第{{item.count}}次异常</div>
        </div>
        <div class="abnormaList-item">
          <div class="flexabnorma">
            <p style="width:30%">
              <em>平台单号:</em>
              {{item.platformOrderId}}
            </p>
            <p style="width:30%">
              <em>配送员:</em>
              {{item.delivery}}
            </p>

            <p>
              <em>地区:</em>
              {{item.mainWarehouse}}
            </p>
            <p>
              <em>分仓:</em>
              {{item.branchWarehouse}}
            </p>
          </div>
          <div class="flexabnorma">
            <em>配送时间:</em>
            {{item.deliveryTime}}
          </div>
          <div class="flexabnorma">
            <em>配送地址:</em>
            {{item.receiverAddress}}
          </div>
          <div class="flexabnorma">
            <em>小熊猫留言:</em>
            {{item.message}}
          </div>

        </div>
        <div class="deliveryflex">
          <el-button class="filter-item" size="small" @click="handleturndown(item)">驳回</el-button>
          <el-button type="primary" class="filter-item" size="small" @click="handleTransfer(item)">转给客服</el-button>
          <el-button type="primary" class="filter-item" size="small" @click="handleModifydelivery(item)">修改配送员</el-button>
        </div>
      </div>
      <div class="abnormaListno" v-if='abnormalList.length<=0'>
        <span>暂无配送异常数据</span>
      </div>
      <pagination v-show="abnormatotal>0" :total="abnormatotal" :page.sync="abnormalFrom.page" :limit.sync="abnormalFrom.size"
        @pagination="getabnormalList" />
    </div>
    <el-dialog title="我的配送订单查看" :visible.sync="dialogorderdetail">
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane label="订单信息" name="first">
          <div class="orderInfo">
            <div class="orderInfo-item">
              <span class="name">后台订单：</span>
              <span>{{orderInfoList.xmbzNo}}</span>
            </div>
            <div class="orderInfo-item">
              <span class="name">平台订单：</span>
              <span>{{orderInfoList.platformOrderId}}</span>
            </div>
            <div class="orderInfo-item">
              <span class="name">分仓：</span>
              <span>{{orderInfoList.receiverAddress}}</span>
            </div>
            <div class="orderInfo-item">
              <span class="name">收货人：</span>
              <span>{{orderInfoList.receiverName}}</span>
            </div>
            <div class="orderInfo-item">
              <span class="name">收货电话：</span>
              <span>{{orderInfoList.receiverPhone}}</span>
            </div>
            <div class="orderInfo-item">
              <span class="name">配送时间：</span>
              <span>{{orderInfoList.deliveryStartTime}}~{{orderInfoList.deliveryEndTime}}</span>
            </div>
            <div class="orderInfo-item">
              <span class="name">配送备注：</span>
              <span>{{orderInfoList.deliveryNotes}}</span>
            </div>
            <div class="orderInfo-item">
              <span class="name">客户备注：</span>
              <span>{{orderInfoList.customerNotes}}</span>
            </div>
            <div class="orderInfo-item">
              <span class="name">客服备注：</span>
              <span>{{orderInfoList.customerServiceNotes}}</span>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane label="商品信息" name="second">
          <div class="goodInfo">
            <div class="goodInfomain" v-for="(child,index2) in goodInfoData" :key="index2">
              <div class="goodInfo-item">
                <span class="name">蛋糕：</span>
                <span>{{child.goodsName}}</span>
              </div>
              <div class="goodInfo-item">
                <span class="name">价格：</span>
                <span v-if="child.totalPrice">{{child.totalPrice/100}}</span>
              </div>
              <div class="goodInfo-item">
                <span class="name">规格：</span>
                <span>{{child.goodsSpecs}}</span>
              </div>
              <div class="goodInfo-item">
                <span class="name">数量：</span>
                <span>{{child.num}}</span>
              </div>
              <div class="goodInfo-item">
                <span class="name">状态：</span>
                <span>{{child.productionStateName}}</span>
              </div>
              <div class="goodInfo-item">
                <span class="name">祝福语：</span>
                <span>{{child.blessings}}</span>
              </div>
            </div>
            <div class="goodInfototal">
              所选蛋糕总计:
              <span>{{goodInfototal}}</span>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane label="配送地址" name="third">
          <div class="map">
            <div class="">
              <p>
                <span class="order-messageing">配送地址：</span>
                <span>{{ orderInfoList.receiverAddress }}</span>
              </p>
            </div>
            <el-amap vid="amapDemo" id="amapDemo" style='height: 400px;'></el-amap>
            <!-- <DetailMap id="amapDemo"></DetailMap> -->
          </div>
        </el-tab-pane>
        <el-tab-pane label="订单日志" name="fourth" style="min-height: 500px;">
          <div class="radio" style="margin-bottom: 20px;font-size: 15px;">
            显示方式：
            <el-radio-group v-model="reverse">
              <el-radio :label="true">倒序</el-radio>
              <el-radio :label="false">正序</el-radio>
            </el-radio-group>
          </div>
          <el-timeline :reverse="reverse">
            <el-timeline-item v-for="(item,index) in activities" :key="index" placement="top" style="font-size: 15px;">
              <el-card style="box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);width: 90%;">
                <h4 style="margin-left: 8px;">{{ item.operator }}</h4>
                <h4 v-html='item.action'>{{item.action}}</h4>
                <p style="margin-left: 8px;color: #5e6d82;">{{item.updateTime}}</p>
              </el-card>
            </el-timeline-item>
          </el-timeline>
        </el-tab-pane>
        <!-- <el-tab-pane label="订单日志" name="fourth"> -->


        <!-- <el-timeline style="padding-top: 10px;">
            <el-timeline-item v-for="(item,index) in activities" :key="index" placement="top" style="font-size: 15px;">
              <el-card style="box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);width: 90%;">
                <h4 style="margin-left: 8px;">{{ item.operator }}</h4>
                <h4 v-html='item.action'>{{item.action}}</h4>
                <p style="margin-left: 8px;color: #5e6d82;">{{item.updateTime}}</p>
              </el-card>
            </el-timeline-item>
          </el-timeline>
        </el-tab-pane> -->
      </el-tabs>
    </el-dialog>
    <el-dialog title="驳回" :visible.sync="dialogturndownVisible" center>
      <el-form :model="turndownform" ref="turndownform" :rules="rules">
        <el-form-item label="驳回理由" label-width="120px" prop="reason">
          <el-input type="textarea" maxlength="50" show-word-limit v-model="turndownform.reason" :autosize="{ minRows: 6, maxRows:8}"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogturndownVisible = false">取 消</el-button>
        <el-button type="primary" @click="submitturndownform('turndownform')">确 定</el-button>
      </div>
    </el-dialog>
    <!-- 异常配送列表 -->
    <el-dialog title="修改配送员" :visible.sync="dialogDistributorVisible" width="width" lock-scroll>
      <el-button type="warning" plain size="small" style='margin-bottom: 10px;' v-model="delivery" @click='handledeliverys(deliveriesList)'>清空选中</el-button>
      <div v-for="(itemmain, key, index) in deliveriesList" :key="index" style="width: 100%;" class="deliveriesList">
        <div class="deliveryperson">{{ key }}</div>
        <div class="delivery-item">
          <span v-for="item in itemmain" :key="item.index" :class="{'active': item.isSelected== 1}" @click="handledistror(item,deliveriesList)">{{ item.name }}</span>
        </div>
      </div>
      <span slot="footer" class="dialog-footer" v-if="saveflag">
        <el-button type="primary" @click="handelsaveOrdernoraml">保存</el-button>
      </span>
      <span slot="footer" class="dialog-footer" v-else>
        <el-button @click="dialogDistributorVisible = false">取 消</el-button>
        <el-button type="primary" @click="handelDistributeDeliveryForOrder(deliveriesList)">分配</el-button>
      </span>
    </el-dialog>
    <el-dialog title="修改配送员" :visible.sync="dialogDistributorVisibles" width="width" lock-scroll>
      <el-button type="warning" plain size="small" style='margin-bottom: 10px;' v-model="delivery" @click='handledeliverys(deliveriesList)'>清空选中</el-button>
      <div v-for="(itemmain, key, index) in deliveriesList" :key="index" style="width: 100%;" class="deliveriesList">
        <div class="deliveryperson">{{ key }}</div>
        <div class="delivery-item">
          <span v-for="item in itemmain" :key="item.index" :class="{'active': item.isSelected== 1}" @click="handledistror(item,deliveriesList)">{{ item.name }}</span>
        </div>
      </div>
      <span slot="footer" class="dialog-footer" v-if="saveflag">
        <el-button type="primary" @click="handelsaveOrder">保存</el-button>
      </span>
      <span slot="footer" class="dialog-footer" v-else>
        <el-button @click="dialogDistributorVisibles = false">取 消</el-button>
        <el-button type="primary" @click="handelDistributeDeliveryOrder(deliveriesList)">分配</el-button>
      </span>
    </el-dialog>
    <el-dialog title="修改配送员" :visible.sync="dialogDistributorVisibleno" width="width" lock-scroll>
      <el-button type="warning" plain size="small" style='margin-bottom: 10px;' v-model="delivery" @click='handledeliverys(deliveriesList)'>清空选中</el-button>
      <div v-for="(itemmain, key, index) in deliveriesList" :key="index" style="width: 100%;" class="deliveriesList">
        <div class="deliveryperson">{{ key }}</div>
        <div class="delivery-item">
          <span v-for="item in itemmain" :key="item.index" :class="{'active': item.isSelected== 1}" @click="handledistror(item,deliveriesList)">{{ item.name }}</span>
        </div>
      </div>
      <span slot="footer" class="dialog-footer" v-if="saveflag">
        <el-button type="primary" @click="handelsaveOrderno">保存</el-button>
      </span>
      <span slot="footer" class="dialog-footer" v-else>
        <el-button @click="dialogDistributorVisibleno = false">取 消</el-button>
        <el-button type="primary" @click="handelDistributeDeliveryOrderno(deliveriesList)">分配</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
  import {
    getorderNotDeliveryInfos, //获取配送分配页面未分配列表
    getMainWarehouseListAll,
    getdeliveriesList,
    getOrderInfo, //订单信息
    getOrderGoodsInfo, //商品信息
    getEveryAreaDeliveryNum, //获取配送分配页面总仓和分仓的数据
    getUnassignedlist, //未分配列表
    distributeDeliveryForOrderDispatch,
    getOrderOperateLog, // 日志
    getOrderDeliveryInfoByDelivery, //获取配送分配页面配送员的订单列表
    deliverySetOutOrder,
    getOrderDeliveryAbnormalList, //配送异常列表
    turnWorkOrderDeliveryAbnormal, // 配送异常订单转给客服
    rejectOrderDeliveryAbnormal, //驳回配送异常订单
    modifyOrderDeliveryAbnormal, // 修改配送异常订单的配送员

  } from "@/api/orderDispatch";
  import role from "@/assets/image/role.png";
  import Pagination from "@/components/Pagination"; // secondary package based on el-pagination
  export default {
    components: {
      Pagination
    },
    data() {
      return {
        showdelivery: true,
        showabnormal: false,
        reverse: false,
        role, //头像
        total: 2,
        deliveryFrom: {
          deptId: '',
          xmbzNo: "", // 订单号
          platformOrderId: '', //平台单号
          // mainWarehouse: "", //地区
          totalWarehouseId: '',
          warehouseId: "", //分仓
          deliveryStartTime: this.dayjs(
              new Date()
            )
            .format("YYYY-MM-DD 00:00:00")
            .toString(), //配送开始时间
          deliveryEndTime: this.dayjs(
              new Date()
            )
            .format("YYYY-MM-DD 23:59:59")
            .toString(), //配送结束时间
          delivery: '',
          page: 1,
          size: 10
        },

        clickFramingchecked: false,
        mainWarehousesList: [],
        mainWarehouseIds: "",
        mainWarehouseNames: "全部",

        // 仓库
        EveryAreaDeliveryFrom: {
          deptId: '',
          mainWarehouseId: this.mainWarehouseIds, //地区ID
          deliveryStartTime: this.dayjs(
              new Date()
            )
            .format("YYYY-MM-DD 00:00:00")
            .toString(), //配送开始时间
          deliveryEndTime: this.dayjs(
              new Date()
            )
            .format("YYYY-MM-DD 23:59:59")
            .toString(), //配送结束时间
        },

        Launchdate: [
          this.dayjs(
            new Date()
          )
          .format("YYYY-MM-DD 00:00:00")
          .toString(),
          this.dayjs(
            new Date()
          )
          .format("YYYY-MM-DD 23:59:59")
          .toString(),
        ],
        pickerOptions: {
          onPick: (obj) => {
            this.pickerMinDate = new Date(obj.minDate).getTime();
            console.log(this.pickerMinDate, 'pickerMinDate')
          },
          disabledDate: (time) => {
            if (this.pickerMinDate) {
              const day1 = 1 * 24 * 3600 * 1000;
              let maxTime = this.pickerMinDate + day1;
              let minTime = this.pickerMinDate - day1;
              return time.getTime() > maxTime || time.getTime() < minTime;
            }
          }
        },
        DistributionList: [],
        indexs: 0,
        assigning: 2,
        Unassigned: 1,
        //列表数据
        DistributionTableList: [],
        AssigningList: [], //分配
        AssigningData: [],
        // 查看订单
        dialogorderdetail: false,
        listdetails: [],
        activeName: "first", //生产详情显示状态
        orderInfoList: [], //订单信息
        goodInfoData: [],
        abnormalList: [], //异常列表
        abnormalFrom: {
          deptId: this.cityareaId || 1,
          xmbzNo: "", // 订单号
          platformOrderId: '', //平台单号
          delivery: "", //配送员
          page: 1,
          size: 10
        },
        abnormatotal: 0,
        turndownform: {
          reason: "" //理由
        },
        cityareaId: '', //
        rules: {
          reason: [{
            required: true,
            message: "请填写驳回理由",
            trigger: "blur"
          }]
        },
        listLoading: true,
        dialogturndownVisible: false,
        goodInfototal: "", //商品信息价格
        // 配送员
        dialogDistributorVisible: false,
        dialogDistributorVisibles: false,
        dialogDistributorVisibleno: false,
        deliveriesList: [],
        activeIndex: 0,
        activities: [],
        listdetails: [],
        multipleSelections: {},
        multipleSelection: [],
        multipleSelectionNo: [],
        rejectOrderDeliveryAbnormalId: '', // 驳回ID
        deliveriesId: '', //配送员ID
        delivery: '',
        saveflag: false,
        RowSelectionFlag: true,
        checked: false,
        clearOtherNoFalg: false,
        NameFlag: false
      };
    },
    watch: {
      'dialogorderdetail'() {
        if (this.dialogorderdetail) {
          window.removeEventListener("keydown", this.keyupEnter);
        } else {
          window.addEventListener("keydown", this.keyupEnter);
        }
      },
      'dialogDistributorVisibleno'() {
        if (this.dialogDistributorVisibleno) {
          window.removeEventListener("keydown", this.keyupEnter);
        } else {
          window.addEventListener("keydown", this.keyupEnter);
        }
      },
      'dialogDistributorVisible'() {
        if (this.dialogDistributorVisible) {
          window.removeEventListener("keydown", this.keyupEnter);
        } else {
          window.addEventListener("keydown", this.keyupEnter);
        }
      },
      'dialogDistributorVisibles'() {
        if (this.dialogDistributorVisibles) {
          window.removeEventListener("keydown", this.keyupEnter);
        } else {
          window.addEventListener("keydown", this.keyupEnter);
        }
      },
    },
    mounted() {
      var saberareaIds = JSON.parse(localStorage.getItem('saber-areaId'));
      this.cityareaId = saberareaIds['content'];
      this.mainWarehouse();
      setTimeout(() => {
        this.getEveryAreaDeliveryNumList();
        this.getList();
        this.getAssigningList();
      }, 0.5 * 1000);
      window.addEventListener("keydown", this.keyupEnter);
    },
    destroyed() {
      window.removeEventListener("keydown", this.keyDown, false);
    },
    methods: {
      selectBlur(e) {
        if (e.keyCode == 13) {
          this.$refs['mainWarehouseRef'].blur();
          e.returnValue = false;
        }
      },
      // 列表数据------------------------------------------------------------------------------------------------------
      keyupEnter() {
        if (window.event.keyCode == 13) {
          this.handleFilter(this.Launchdate); // 查询事件
        }
      },
      //如果页面有keep-alive缓存功能，这个函数会触发
      activated() {
        window.addEventListener("keydown", this.keyupEnter);
      },
      deactivated() {
        window.removeEventListener("keydown", this.keyupEnter);
      },

      getList() { //未分配列表
        this.listLoading = true;
        const NotDeliveryInfos = {
          deptId: this.cityareaId,
          xmbzNo: this.deliveryFrom.xmbzNo, // 订单号
          platformOrderId: this.deliveryFrom.platformOrderId, //平台单号：
          // mainWarehouse: this.deliveryFrom.mainWarehouse, //地区
          totalWarehouseId: this.deliveryFrom.totalWarehouseId, //地区
          warehouseId: this.deliveryFrom.warehouseId, //分仓
          deliveryStartTime: this.deliveryFrom.deliveryStartTime, //配送开始时间
          deliveryEndTime: this.deliveryFrom.deliveryEndTime, //配送结束时间
          delivery: false,
        }
        getorderNotDeliveryInfos(NotDeliveryInfos).then(response => {
          this.DistributionTableList = response.data.data.list;
          setTimeout(() => {
            this.listLoading = false;
          }, 1.5 * 1000);
          // if (this.deliveryFrom.mainWarehouse == '') {
          //   this.deliveryFrom.mainWarehouse = '全部'
          //   this.mainWarehouseNames = '';
          // }
        })
        this.getabnormalList();
      },
      getAssigningList() { //已分配列表
        this.listLoading = true;
        const DeliveryInfos = {
          deptId: this.cityareaId,
          xmbzNo: this.deliveryFrom.xmbzNo, // 订单号
          platformOrderId: this.deliveryFrom.platformOrderId,
          // mainWarehouse: this.deliveryFrom.mainWarehouse, //地区
          // mainWarehouse: this.mainWarehouseNames == '全部' ? '' : this.mainWarehouseNames, //地区
          totalWarehouseId: this.deliveryFrom.totalWarehouseId, //地区
          warehouseId: this.deliveryFrom.warehouseId, //分仓s
          deliveryStartTime: this.deliveryFrom.deliveryStartTime, //配送开始时间
          deliveryEndTime: this.deliveryFrom.deliveryEndTime, //配送结束时间
          delivery: true,
        }
        getOrderDeliveryInfoByDelivery(DeliveryInfos).then(response => {
          response.data.data.map((item, index) => {
            item['id'] = index;
          })
          this.AssigningData = response.data.data;
          setTimeout(() => {
            this.listLoading = false;
          }, 1.5 * 1000);
          // if (this.deliveryFrom.mainWarehouse == '') {
          //   // this.deliveryFrom.mainWarehouse = '全部'
          //   this.mainWarehouseNames = '';
          // }
        })
      },
      getEveryAreaDeliveryNumList() { //获取配送分配页面总仓和分仓的数据
        this.listLoading = true;
        this.EveryAreaDeliveryFrom.deptId = this.cityareaId
        this.EveryAreaDeliveryFrom.mainWarehouseId = this.mainWarehouseIds;
        this.EveryAreaDeliveryFrom.deliveryStartTime = this.deliveryFrom.deliveryStartTime, //配送开始时间
          this.EveryAreaDeliveryFrom.deliveryEndTime = this.deliveryFrom.deliveryEndTime, //配送结束时间
          getEveryAreaDeliveryNum(this.EveryAreaDeliveryFrom).then(res => {
            this.DistributionList = res.data.data;
          });
      },
      handleFilter(times) { //查询
        this.deliveryFrom.page = 1;
        // this.deliveryFrom.mainWarehouse = this.deliveryFrom.mainWarehouse;
        this.deliveryFrom.totalWarehouseId = this.mainWarehouseIds;

        this.EveryAreaDeliveryFrom.mainWarehouseId = this.mainWarehouseIds;
        if (times) {
          this.deliveryFrom.deliveryStartTime = this.dayjs(
              times[0]
            )
            .format("YYYY-MM-DD HH:mm:00")
            .toString();
          this.deliveryFrom.deliveryEndTime = this.dayjs(
              times[1]
            )
            .format("YYYY-MM-DD HH:mm:59")
            .toString();
        }
        var time1 = Date.parse(this.deliveryFrom.deliveryStartTime);
        var time2 = Date.parse(this.deliveryFrom.deliveryEndTime);
        //讲两个时间相减，求出相隔的天数
        var dayCount = Math.abs(time2 - time1) / 1000 / 60 / 60 / 24;
        if (dayCount > 1) {
          this.$message({
            showClose: true,
            message: "时间间隔不可超过1天",
            type: "warning"
          });
        } else {
          if (this.deliveryFrom.xmbzNo) {
            this.indexs = '0';
            // this.mainWarehouse();
            this.getEveryAreaDeliveryNumList();
            const NotDeliveryInfos = {
              deptId: this.cityareaId,
              xmbzNo: this.deliveryFrom.xmbzNo, // 订单号
              platformOrderId: this.deliveryFrom.platformOrderId,
              // mainWarehouse: this.mainWarehouseNames == '全部' ? '' : this.mainWarehouseNames, //地区
              // mainWarehouseId:this.mainWarehouseIds,
              totalWarehouseId: this.deliveryFrom.totalWarehouseId, //地区
              // mainWarehouse: this.mainWarehouseNames == '' ? this.deliveryFrom.mainWarehouse : this.mainWarehouseNames, //地区
              warehouseId: this.deliveryFrom.warehouseId, //分仓
              deliveryStartTime: this.deliveryFrom.deliveryStartTime, //配送开始时间
              deliveryEndTime: this.deliveryFrom.deliveryEndTime, //配送结束时间
              delivery: false,
            }
            getorderNotDeliveryInfos(NotDeliveryInfos).then(response => {
              this.DistributionTableList = response.data.data.list;

              setTimeout(() => {
                this.listLoading = false;
              }, 1.5 * 1000);
            })
            const DeliveryInfos = {
              deptId: this.cityareaId,
              xmbzNo: this.deliveryFrom.xmbzNo, // 订单号
              platformOrderId: this.deliveryFrom.platformOrderId, //平台单号
              // mainWarehouse: this.mainWarehouseNames == '' ? this.deliveryFrom.mainWarehouse : this.mainWarehouseNames, //地区
              // mainWarehouse: this.mainWarehouseNames == '全部' ? '' : this.mainWarehouseNames, //地区
              // mainWarehouseId:this.mainWarehouseIds,
              totalWarehouseId: this.deliveryFrom.totalWarehouseId, //地区
              // branchWarehouse: this.deliveryFrom.branchWarehouse, //分仓
              deliveryStartTime: this.deliveryFrom.deliveryStartTime, //配送开始时间
              deliveryEndTime: this.deliveryFrom.deliveryEndTime, //配送结束时间
              delivery: true,
            }
            getOrderDeliveryInfoByDelivery(DeliveryInfos).then(response => {
              response.data.data.map((item, index) => {
                item['id'] = index;
              })
              this.AssigningData = response.data.data;
              setTimeout(() => {
                this.listLoading = false;
              }, 1.5 * 1000);
            })

          } else {
            this.indexs = '0';
            this.getEveryAreaDeliveryNumList();
            const NotDeliveryInfos = {
              deptId: this.cityareaId,
              xmbzNo: this.deliveryFrom.xmbzNo, // 订单号
              platformOrderId: this.deliveryFrom.platformOrderId, //平台单号：
              // mainWarehouse: this.mainWarehouseNames == '' ? this.deliveryFrom.mainWarehouse : this.mainWarehouseNames, //地区
              // mainWarehouse: this.mainWarehouseNames == '全部' ? '' : this.mainWarehouseNames, //地区
              totalWarehouseId: this.deliveryFrom.totalWarehouseId, //地区
              deliveryStartTime: this.deliveryFrom.deliveryStartTime, //配送开始时间
              deliveryEndTime: this.deliveryFrom.deliveryEndTime, //配送结束时间
              delivery: false,
            }
            getorderNotDeliveryInfos(NotDeliveryInfos).then(response => {
              this.DistributionTableList = response.data.data.list;
              setTimeout(() => {
                this.listLoading = false;
              }, 1.5 * 1000);
            })
            const DeliveryInfos = {
              deptId: this.cityareaId,
              xmbzNo: this.deliveryFrom.xmbzNo, // 订单号
              platformOrderId: this.deliveryFrom.platformOrderId, //平台单号
              // mainWarehouse: this.mainWarehouseNames == '全部' ? '' : this.mainWarehouseNames, //地区
              totalWarehouseId: this.deliveryFrom.totalWarehouseId, //地区
              // mainWarehouse: this.mainWarehouseNames == '' ? this.deliveryFrom.mainWarehouse : this.mainWarehouseNames, //地区
              // branchWarehouse: this.deliveryFrom.branchWarehouse, //分仓
              deliveryStartTime: this.deliveryFrom.deliveryStartTime, //配送开始时间
              deliveryEndTime: this.deliveryFrom.deliveryEndTime, //配送结束时间
              delivery: true,
            }
            getOrderDeliveryInfoByDelivery(DeliveryInfos).then(response => {
              response.data.data.map((item, index) => {
                item['id'] = index;
              })

              this.AssigningData = response.data.data;
              setTimeout(() => {
                this.listLoading = false;
              }, 1.5 * 1000);
            })
          }


        }

      },
      handleSetOutOrder(item) { //配送出发
        deliverySetOutOrder({
          orderIds: [item.id]
        }).then(res => {
          this.$message({
            type: "success",
            message: '订单配送出发成功'
          });
          setTimeout(() => {
            this.getList();
            this.getAssigningList();
            this.getEveryAreaDeliveryNumList();

          }, 1.5 * 1000);

        })
      },
      handleSelectionChange(item) { // 已分配多选
        this.clearOtherNoFalg = true;
        let selParentItem = [];
        item.forEach(selChild => {
          this.AssigningData.forEach(parent => {
            parent.list.forEach(child => {
              if (selChild.id === child.id) {
                selParentItem = parent
              }
            })
          })
        })
        const {
          id = null
        } = selParentItem;
        this.multipleSelections[`multipleSelection${id}`] = item;
        this.multipleSelection = this.multipleSelections[`multipleSelection${id}`];
      },
      handleSelectionChangeNo(item) { //未分配多选
        this.multipleSelectionNo = item;
      },
      clearOtherNo() { //清除已分配数据
        this.AssigningData.map((item, index) => {
          this.$refs[`multipleTable${index}`][0].clearSelection();
        })
        this.clearOtherNoFalg = false
        this.multipleSelection = [];
      },
      clearOther(item) { //清除未分配数据
        this.$refs.multipleTableNo.clearSelection()
        const {
          id
        } = item;
        const noSel = this.AssigningData.filter(parent => parent.id !== id);
        noSel.forEach(item => {
          this.$refs[`multipleTable${item.id}`][0].clearSelection()
          this.multipleSelections[`multipleSelection${item.id}`] = [];
        })
        this.clearOtherNoFalg = false

      },
      handleAllSetOutOrder(item) { //批量配送出发
        var SetOutOrderIds = [];
        const {
          id
        } = item;

        if (this.multipleSelection && this.multipleSelection.length >
          0 && this.multipleSelections[`multipleSelection${id}`] && this.multipleSelections[`multipleSelection${id}`].length >
          0) {
          this.multipleSelection.map(item => {
            SetOutOrderIds.push(item.id)
          })

          deliverySetOutOrder({
            orderIds: SetOutOrderIds
          }).then(res => {
            this.$message({
              type: "success",
              message: '订单配送出发成功'
            });
            setTimeout(() => {
              this.getList();
              this.getAssigningList();
              this.getEveryAreaDeliveryNumList();
            }, 1.5 * 1000);
          })

        } else {
          this.$message.warning("请选择至少一张订单");
          return;
        }
      },
      // 公共模块------------------------------------------------------------------------------------------------------
      mainWarehouse() { // 地区列表
        getMainWarehouseListAll({
          parentId: this.cityareaId
        }).then(response => {
          response.data.data.unshift({
            id: '',
            deptName: "全部"
          })
          this.mainWarehousesList = response.data.data;
          this.mainWarehouseIds = response.data.data[0].id;
          this.mainWarehouseNames = response.data.data[0].deptName;
          this.deliveryFrom.totalWarehouseId = response.data.data[0].id;
          // if (response.data.data) {
          //   if (this.mainWarehouseNames == '') {
          //     this.deliveryFrom.mainWarehouse = response.data.data[0].deptName;
          //     this.mainWarehouseIds = response.data.data[0].id;
          //   }
          // }

          //
        });
      },
      // 地区选中事件
      getmainWarehouseIds(data) {
        this.deliveryFrom.totalWarehouseId = data.value;
        if (this.mainWarehouseNames == '全部') {
          this.mainWarehouseNames = '';
          this.mainWarehouseIds = data.value;
        } else {
          this.mainWarehouseNames = data.label;
          this.mainWarehouseIds = data.value;
          this.barnchWarehousesName = '全部';
        }
        this.deliveryFrom.warehouseId = "";
      },
      // 区域及分仓数据切换
      handleTabs(index, item) {
        console.log(item, item.mainWarehouseId)
        this.indexs = index;


        if (this.mainWarehouseNames == '全部' || this.mainWarehouseNames == '') {
          console.log(item, '122')
          // this.mainWarehouseIds=item.mainWarehouseId;
          this.warehouseId = item.warehouseId;
          this.deliveryFrom.totalWarehouseId = item.mainWarehouseId;
          this.deliveryFrom.warehouseId = item.warehouseId;
          this.getEveryAreaDeliveryNumList();
          this.getList();
          this.getAssigningList();
        } else {
          if (this.indexs == 0) {
            // this.deliveryFrom.mainWarehouse = item.name;
            this.deliveryFrom.totalWarehouseId = item.mainWarehouseId
            this.deliveryFrom.warehouseId = item.warehouseId;
            this.getEveryAreaDeliveryNumList();
            this.getList();
            this.getAssigningList();
          } else {
            this.deliveryFrom.totalWarehouseId = item.mainWarehouseId
            this.deliveryFrom.warehouseId = item.warehouseId;
            this.getEveryAreaDeliveryNumList();
            this.getList();
            this.getAssigningList();

          }

        }


      },

      //查看订单------------------------------------------------------------------------------------------------
      handleWatchOrder(row) {
        this.activeName = 'first'
        this.reverse = false;
        this.listdetails = Object.assign({}, row); // copy obj
        this.dialogorderdetail = true;
        getOrderInfo({
          orderId: this.listdetails.id
        }).then(res => {
          this.orderInfoList = res.data.data;
        });
      },
      // 我的配送订单查看切换
      handleClick(tab) {
        if (tab.index == "0") {
          getOrderInfo({
            orderId: this.listdetails.id
          }).then(res => {
            this.orderInfoList = res.data.data;
          });
        } else if (tab.index == "1") {
          getOrderGoodsInfo({
            orderId: this.listdetails.id
          }).then(res => {
            this.goodInfoData = res.data.data;
            var goodInfototal = [];
            this.goodInfoData.map(item => {
              goodInfototal.push(item.totalPrice);
            });
            goodInfototal.reduce(function(total, currentValue) {
              goodInfototal = total + currentValue;
              return goodInfototal;
            });
            this.goodInfototal = goodInfototal / 100;
          });
        } else if (tab.index == "2") {
          getOrderInfo({
            orderId: this.listdetails.id
          }).then(res => {
            this.orderInfoList = res.data.data;
            let arriveCoor = [
              this.orderInfoList.longitude,
              this.orderInfoList.latitude
            ];
            this.addMarker(arriveCoor);
          });
        } else if (tab.index == "3") {
          getOrderOperateLog({
            orderId: this.listdetails.id
          }).then(res => {
            this.activities = res.data.data
          })
        }
      },
      //地图锚点
      addMarker(arriveCoor) {
        var map = new AMap.Map("amapDemo");
        // 点标记中的文本
        var marker = new AMap.Marker({
          // icon: "https://webapi.amap.com/theme/v1.3/markers/b/mark_bs.png",
          icon: new AMap.Icon({
            image: 'http://a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png',
            size: new AMap.Size(28, 36), //图标所处区域大小
            imageSize: new AMap.Size(28, 36) //图标大小
          }),
          position: arriveCoor,
          offset: new AMap.Pixel(-20, -20)
        }); // 设置label标签
        // label默认蓝框白底左上角显示，样式className为：amap-marker-label
        marker.setLabel({
          offset: new AMap.Pixel(-20, -20), //设置文本标注偏移量
          content: `<div class='info' style='padding:2px;border: 1px solid blue;'>${
          this.orderInfoList.receiverAddress
        }</div>`, //设置文本标注内容
          direction: "top" //设置文本标注方位
        });
        map.add(marker);
        map.setZoomAndCenter(13, arriveCoor);
      },
      // 异常列表数据------------------------------------------------------------------------
      getabnormalList() {
        this.abnormalFrom.deptId = this.cityareaId
        getOrderDeliveryAbnormalList(this.abnormalFrom).then(res => {
          this.abnormalList = res.data.data.rows;
          this.abnormatotal = res.data.data.total;
        })
      },
      HandledeliveryAbnormal() {
        this.showdelivery = false;
        this.showabnormal = true;
        this.getabnormalList();
      },
      handleabnormalFilter() {
        this.getList();
      },
      backabnormal() {
        this.showdelivery = true;
        this.showabnormal = false;
      },
      // 驳回按钮
      handleturndown(item) {
        this.dialogturndownVisible = true;
        this.rejectOrderDeliveryAbnormalId = item.id
      },
      // 确定驳回页面
      submitturndownform(formName) {
        this.$refs[formName].validate(valid => {
          if (valid) {
            const rejectData = {
              id: this.rejectOrderDeliveryAbnormalId,
              reason: this.turndownform.reason
            }
            this.$confirm("确定要把该异常配送订单驳回？ 是否继续?", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
              })
              .then(() => {
                rejectOrderDeliveryAbnormal(rejectData).then(res => {
                  this.$message({
                    type: "success",
                    message: "该异常配送订单处理完成!"
                  });
                  this.dialogturndownVisible = false;
                  this.getabnormalList();

                })
              })
              .catch(() => {
                this.$message({
                  type: "info",
                  message: "已取消驳回处理"
                });
              });

            // alert('submit!');
          } else {
            return false;
          }
        });
      },
      clickFraming(val) { //开启刷单
        window.clearInterval(this.clickfarmingTimer)
        if (val == true) {
          // console.log('this.isQueryFlag',this.isQueryFlag)
          this.getList();
          this.getAssigningList();
          this.getEveryAreaDeliveryNumList();
          this.clickfarmingTimer = setInterval(() => {
            this.getList();
            this.getAssigningList();
            this.getEveryAreaDeliveryNumList();
          }, 600 * 1000)
        } else {
          window.clearInterval(this.clickfarmingTimer)
        }
      },
      // 选择配送员-------------------------------------------------------------------------------------
      handledistror(sel, list) {
        this.saveflag = false
        for (let warp in list) {
          list[warp].map(item => {
            item.isSelected = 0
            if (sel.name === item.name) {
              item.isSelected = 1
            }
          })
        }
        this.delivery = sel.name;
      },
      // 清空配送员
      handledeliverys(list) {
        this.saveflag = true
        for (let warp in list) {
          list[warp].map(item => {
            item.isSelected = 0
          })
        }
        this.delivery = ''
      },
      handelsaveOrdernoraml() {
        const selectData = {
          id: this.deliveriesId,
          delivery: this.delivery
        };
        modifyOrderDeliveryAbnormal(selectData).then(() => {
          this.$notify({
            title: '提示',
            message: '该订单的配送员已清空',
            type: 'warning'
          });
          this.dialogDistributorVisible = false;
          this.dialogDistributorVisibles = false;
          setTimeout(() => {
            this.getEveryAreaDeliveryNumList();
            this.getList();
            this.getAssigningList();
          }, 1.5 * 1000);
        });

      },

      handelsaveOrder() {
        let ids = [];
        this.multipleSelection.map(item => {
          ids.push(item.id);
        });
        const selectData = {
          ids: ids,
          account: this.delivery
        };
        distributeDeliveryForOrderDispatch(selectData).then(() => {
          this.$notify({
            title: '提示',
            message: '该订单的配送员已清空',
            type: 'warning'
          });
          this.dialogDistributorVisible = false;
          this.dialogDistributorVisibles = false;
          this.clearOtherNoFalg = false
          setTimeout(() => {
            this.getEveryAreaDeliveryNumList();
            this.getList();
            this.getAssigningList();
          }, 1.5 * 1000);
        });
      },
      handelsaveOrderno() { //清空配送员保存
        let ids = [];
        this.multipleSelectionNo.map(item => {
          ids.push(item.id);
        });
        const selectData = {
          ids: ids,
          account: this.delivery
        };
        distributeDeliveryForOrderDispatch(selectData).then(() => {
          this.$notify({
            title: '提示',
            message: '该订单的配送员已清空',
            type: 'warning'
          });
          this.dialogDistributorVisible = false;
          this.dialogDistributorVisibles = false;
          this.dialogDistributorVisibleno = false;
          setTimeout(() => {
            this.getEveryAreaDeliveryNumList();
            this.getList();
            this.getAssigningList();
          }, 1.5 * 1000);
        });
      },
      handleTransfer(item) { //转给客服
        this.$confirm("把订单交给客服处理？ 是否继续?", "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          })
          .then(() => {
            turnWorkOrderDeliveryAbnormal({
              id: item.id
            }).then(
              () => {
                this.$message({
                  type: "success",
                  message: "已转到异常工单!"
                });
                this.getabnormalList();
              }
            );
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消转给客服处理"
            });
          });
      },
      handleModifydelivery(item) { //配送异常列表
        this.deliveriesId = item.id
        //修改配送员
        this.dialogDistributorVisible = true;
        let ids = [];
        this.multipleSelection.map(item => {
          ids.push(item.xmbzNo);
        });
        const selectData = {
          xmbzNos: item.xmbzNo,
          deptId: this.cityareaId
        };
        getdeliveriesList(selectData).then(response => {
          this.deliveriesList = response.data.data;
          let isSelectedlist = [];
          for (let warp in this.deliveriesList) {
            this.deliveriesList[warp].map(item => {
              if (item.isSelected == '1') {
                isSelectedlist.push(item)
              }
            })
          }
          if (isSelectedlist.length > 0) {
            this.saveflag = false
          } else {
            this.saveflag = true
          }
        });
      },
      handleModifydeliverysUn() { //未分配修改配送员
        if (this.multipleSelectionNo.length === 0) {
          this.$message.warning("请选择至少一张订单");
          return;
        } else {
          this.dialogDistributorVisibleno = true;
          let ids = [];
          this.multipleSelectionNo.map(item => {
            ids.push(item.xmbzNo);
          });
          const selectData = {
            xmbzNos: ids.join(','),
            deptId: this.cityareaId
          };
          getdeliveriesList(selectData).then(response => {
            this.deliveriesList = response.data.data;
            let isSelectedlist = [];
            for (let warp in this.deliveriesList) {
              this.deliveriesList[warp].map(item => {
                if (item.isSelected == '1') {
                  isSelectedlist.push(item)
                }
              })
            }
            if (isSelectedlist.length > 0) {
              this.saveflag = false
            } else {
              this.saveflag = true
            }
          });
        }
      },
      handleModifydeliverys(item) {
        this.clearOtherNoFalg = false;
        const {
          id
        } = item;
        if (this.$refs[`multipleTable${id}`][0].selection.length > 0) {
          this.dialogDistributorVisibles = true;
          let ids = [];
          this.multipleSelections[`multipleSelection${id}`].map(item => {
            ids.push(item.xmbzNo);
          });
          const selectData = {
            xmbzNos: ids.join(','),
            deptId: this.cityareaId
          };
          getdeliveriesList(selectData).then(response => {
            this.deliveriesList = response.data.data;
            let isSelectedlist = [];
            for (let warp in this.deliveriesList) {
              this.deliveriesList[warp].map(item => {
                if (item.isSelected == '1') {
                  isSelectedlist.push(item)
                }
              })
            }
            if (isSelectedlist.length > 0) {
              this.saveflag = false
            } else {
              this.saveflag = true
            }
          });

        } else {
          this.$message.warning("请选择至少一张订单");
          return;
        }

      },

      handleSelectionNoChange(val) {
        this.multipleSelection = val;
        // this.
      },
      // 配送分配的修改配送员
      handelDistributeDeliveryOrder(list) {
        if (this.multipleSelection.length === 0) {
          this.$message.warning("请选择至少一张订单");
          return;
        }
        let isSelectedlist = [];
        for (let warp in list) {
          list[warp].map(item => {
            if (item.isSelected == '1') {
              isSelectedlist.push(item)
            }
          })
        }
        if (isSelectedlist.length > 1) {
          this.$message.warning("不能同时分配给多个配送员");
          return;
        }
        let ids = [];
        this.multipleSelection.map(item => {
          ids.push(item.id);
        });
        const selectData = {
          ids: ids,
          account: this.delivery == '' ? isSelectedlist[0].name : this.delivery
        };
        distributeDeliveryForOrderDispatch(selectData).then(() => {
          this.$notify({
            title: "成功",
            message: "修改配送员成功",
            type: "success",
            duration: 2000
          });
          this.dialogDistributorVisibles = false;
          this.clearOtherNoFalg == false
          setTimeout(() => {
            this.getEveryAreaDeliveryNumList();
            this.getList();
            this.getAssigningList();
          }, 1.5 * 1000);

        });

      },

      handelDistributeDeliveryOrderno(list) {
        if (this.multipleSelectionNo.length === 0) {
          this.$message.warning("请选择至少一张订单");
          return;
        }
        let isSelectedlist = [];
        for (let warp in list) {
          list[warp].map(item => {
            if (item.isSelected == '1') {
              isSelectedlist.push(item)
            }
          })
        }
        if (isSelectedlist.length > 1) {
          this.$message.warning("不能同时分配给多个配送员");
          return;
        }
        let ids = [];
        this.multipleSelectionNo.map(item => {
          ids.push(item.id);
        });
        const selectData = {
          ids: ids,
          account: this.delivery == '' ? isSelectedlist[0].name : this.delivery
        };
        distributeDeliveryForOrderDispatch(selectData).then(() => {
          this.$notify({
            title: "成功",
            message: "修改配送员成功",
            type: "success",
            duration: 2000
          });
          this.dialogDistributorVisibleno = false;
          setTimeout(() => {
            this.getEveryAreaDeliveryNumList();
            this.getList();
            this.getAssigningList();
          }, 1.5 * 1000);
        });
      },
      handelDistributeDeliveryForOrder(list) {
        let isSelectedlist = [];
        for (let warp in list) {
          list[warp].map(item => {
            if (item.isSelected == '1') {
              isSelectedlist.push(item)
            }
          })
        }
        if (isSelectedlist.length > 1) {
          this.$message.warning("不能同时分配给多个配送员");
          return;
        }
        const deliveryData = {
          id: this.deliveriesId,
          delivery: this.delivery == '' ? isSelectedlist[0].name : this.delivery
        }
        modifyOrderDeliveryAbnormal(deliveryData).then((res) => {
          if (res.data.code == 200) {
            this.$notify({
              title: "成功",
              message: "修改配送员成功",
              type: "success",
              duration: 2000
            });
            this.dialogDistributorVisible = false;
            setTimeout(() => {
              this.listLoading = false;
            }, 1.5 * 1000);
            this.getabnormalList();
          }
        });
      }
    }
  };
</script>
<style lang="scss">
  .app-container-delivery {
    padding: 20px 10px;

    table tr,
    table tr td {
      border-right: none !important;
    }

    .maindelivery {
      .delivery-container {
        .flexmaindelivery {
          display: flex;
          display: flex;
          flex-wrap: wrap;

          // .formitem {
          //   width: 640px;
          // }
        }

        .el-form-item {
          margin-bottom: 10px !important;
        }
      }

      .Distribution {
        display: flex;
        margin-bottom: 20px;
        cursor: pointer;
        flex-wrap: wrap;

        .Distribution-item {
          box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
          border-radius: 4px;
          border: 1px solid #ebeef5;
          background-color: #fff;
          overflow: hidden;
          color: #606266;
          -webkit-transition: 0.3s;
          transition: 0.3s;
          margin-bottom: 5px;
          padding: 3px;
          margin-right: 4px;
          text-align: center;
          box-sizing: border-box;

          .Warehouse {
            border-bottom: 1px solid #cccccc;
            height: 24px;
          }

          .deliveryData {
            // display: flex;
            text-align: center;
            // justify-content: space-between;

            .Unassigned {
              display: flex;
              line-height: 24px;
              justify-content: space-around;

              .names {
                margin-right: 8px;
              }
            }

            .allocated {
              line-height: 24px;
              display: flex;
              justify-content: space-around;
              border-top: 1px solid #cccccc;
            }
          }

          &.active {
            // font-size: 20px;
            color: #fff;
            background: #43a0ff;
            // border-bottom: 1px solid #43a0ff;
          }
        }

        .delivery-Abnormal {
          display: flex;
          align-items: center;
        }
      }

      .DistributionTable {
        img {
          width: 20px;
          height: 20px;
          vertical-align: middle;
          margin-right: 10px;
        }

        .unassignedList {
          margin-bottom: 20px;

          .tag {
            line-height: 24px;
            margin-bottom: 10px;
            display: flex;

            .ordernum {

              .order-quantity {
                font-size: 14px;
                color: #707275;
                line-height: 24px;
              }
            }
          }
        }

        .assigning {
          margin-bottom: 20px;

          .tag {
            line-height: 24px;
            margin-bottom: 10px;
            display: flex;
            font-size: 14px;

            .ordernum {
              margin-right: 15px;

              .delivery {
                color: #707275;
              }

              .order-quantity {
                color: #f76234;
              }

              .order-signfor {
                color: #77b714;
              }
            }
          }
        }
      }
    }

    .orderInfo {
      .orderInfo-item {
        display: flex;
        line-height: 40px;
        display: flex;
        color: #8c8989;

        .name {
          display: block;
          width: 120px;
          color: #000;
        }
      }
    }

    .goodInfo {
      .goodInfomain {
        webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
        box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
        border-radius: 4px;
        border: 1px solid #ebeef5;
        background-color: #fff;
        overflow: hidden;
        color: #606266;
        transition: 0.3s;
        margin-bottom: 10px;
        padding: 10px;

        .goodInfo-item {
          display: flex;
          line-height: 24px;

          .name {
            display: block;
            color: #000;
          }
        }
      }

      .goodInfototal {
        font-weight: 500;
        font-size: 18px;
      }
    }

    .showabnormal {
      .fifterabnormal {
        .flexmaindelivery {
          display: flex;

          .formitem {
            width: 640px;
          }
        }

        .el-form-item {
          margin-bottom: 10px !important;
        }
      }

      .tab {
        display: flex;
        margin-bottom: 10px;
        cursor: pointer;

        .tab-item {
          color: #cccccc;
        }

        .tab-item.act {
          color: #000;
        }
      }

      .abnormaList {
        box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
        border-radius: 4px;
        border: 1px solid #ebeef5;
        background-color: #fff;
        overflow: hidden;
        color: #606266;
        -webkit-transition: 0.3s;
        transition: 0.3s;
        margin-bottom: 10px;


        .line {

          display: flex;
          line-height: 40px;

          .xmbzNo {
            padding-left: 20px;
            padding-right: 100px;
            color: #000;
            width: 400px;
          }

          .count {
            color: #ff0000;
          }

        }

        .abnormaList-item {
          border-top: 1px solid #CCCCCC;
          padding: 10px 10px 0;

          .flexabnorma {
            display: flex;
            line-height: 30px;

            em {
              font-style: normal;
              padding: 0 5px;
            }

            p {
              padding: 0;
              margin: 0;
              width: 15%;

              em {
                font-style: normal;
                padding: 0 5px;
              }
            }
          }


        }

        .deliveryflex {
          padding: 0 10px 10px;
          display: flex;
          justify-content: space-around;
          width: 300px;
          float: right;
        }
      }

      .abnormaListno {
        box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
        border-radius: 4px;
        border: 1px solid #ebeef5;
        background-color: #fff;
        overflow: hidden;
        color: #606266;
        -webkit-transition: 0.3s;
        transition: 0.3s;
        margin-bottom: 10px;
        padding: 20px;
        text-align: center;
      }
    }

    .deliveriesList {
      border-top: 1px solid #ebeef5;
      display: flex;
      line-height: 44px;

      .deliveryperson {
        margin-right: 10px;
      }

      .delivery-item {
        cursor: pointer;
        display: flex;
        flex: 1;
        width: 50%;
        flex-wrap: wrap;

        span {
          width: 90px;

          text-align: center;

          &.active {
            width: 77px;
            height: 32px;
            line-height: 17px;
            border-radius: 3px;
            background-color: rgba(238, 248, 232, 1);
            color: rgba(122, 199, 86, 1);
            font-size: 12px;
            text-align: left;
            font-family: Roboto;
            border: 1px solid rgba(122, 199, 86, 1);
            text-align: center;
            line-height: 32px;
            margin-top: 6px;
          }
        }
      }

      &:last-child {
        border-bottom: 1px solid #ebeef5;
      }
    }
  }
</style>
